<template>
  <div>
    <bpm-c-form>
    <bpm-c-block :ptitle="inputTitle[0]"
                 :preadonly="inputReadonly[0]"
                 :pinputtype="inputType[0]"
                 :pline="inputLine[0]"
                 v-model="selectedGridInfo[gridShowInfo[0]]"
                 @valueChanged="setSelectedGridInfoCellIndex('',0)"
    />
    <bpm-c-block :ptitle="inputTitle[1]"
                 :preadonly="inputReadonly[1]"
                 :pinputtype="inputType[1]"
                 :pline="inputLine[1]"
                 v-model="selectedGridInfo[gridShowInfo[1]]"
                 @valueChanged="setSelectedGridInfoCellIndex('',1)"
    />
    </bpm-c-form>
    <bpm-c-form>
    <bpm-c-block :ptitle="inputTitle[2]"
                 :preadonly="inputReadonly[2]"
                 :pinputtype="inputType[2]"
                 :pline="inputLine[2]"
                 v-model="selectedGridInfo[gridShowInfo[2]]"
                 @valueChanged="setSelectedGridInfoCellIndex('',2)"
    />
    </bpm-c-form>
    <bpm-c-form>
    <bpm-c-block :ptitle="inputTitle[3]"
                 :preadonly="inputReadonly[3]"
                 :pinputtype="inputType[3]"
                 :pline="inputLine[3]"
                 v-model="selectedGridInfo[gridShowInfo[3]]"
                 @valueChanged="setSelectedGridInfoCellIndex('',3)"
    />
    </bpm-c-form>
    <!--v-model="selectedGridInfo[gridShowInfo[i]]"-->
  </div>
</template>

<script>
import { mapState, mapActions } from 'vuex'

export default {
  name: 'bpmDFeeChoose',
  model: {
    prop: 'selectedGridInfo',
    event: 'selectedGridInfoChanged'
  },
  props: {
    title: '',
    pselectType: {
      type: String,
      default: ''
    }
  },
  data () {
    let inputLine = [2, 2, 1, 1]
    let inputType = ['number', 'number', 'number', 'textarea']
    let gridShowInfo = ['billssum', 'actualremibursesum', 'billscount', 'remark']
    return {
      inputLine: inputLine,
      inputType: inputType,
      gridShowInfo: gridShowInfo,
      selectedGridInfoCellIndex: -1
    }
  },
  computed: {
    ...mapState(['ssc', 'chooseDialogEnum', 'pageType', 'pageTypeEnum', 'lang']),
    inputTitle () {
      return [
        this.getLanguage('label.whBtTransportationdetails.billssum'),
        this.getLanguage('label.whBtTransportationdetails.actualremibursesum'),
        this.getLanguage('label.whBtTransportationdetails.billscount'),
        this.getLanguage('label.whBtTransportationdetails.remark')
      ]
    },
    selectedGridInfo () {
      return this.$store.state.gridSelectRow.ssc.reimburse.whBtTransportationDetails
    },
    inputReadonly () {
      console.log('-----readonly-------')
      switch (this.pageType) {
        case this.pageTypeEnum.draft:
          return [false, true, false, false]
        case this.pageTypeEnum.approve:
          return [false, true, false, false]
        case this.pageTypeEnum.approveFee:
          return [true, true, false, true]
        case this.pageTypeEnum.view:
          return [false, true, false, false]
      }
    }
  },
  methods: {
    ...mapActions(['updateDataSscCachePaymentInfo']),
    setSelectedGridInfoCellIndex (v, i) {
      this.selectedGridInfoCellIndex = i
      if (this.pageType === this.pageTypeEnum.draft) {
        if (i === 0) {
          // JsReimburseDraft.setTransActulaReim()
        }
      } else if (this.pageType === this.pageTypeEnum.approveFee) {
        if (i === 2) { // 实际报销金额
          let resObj = this.onSubEditCell('CVPageTable5', 2, this.$store.state.gridSelectIndex.whBtTransportationDetails, 6, this.selectedGridInfo[this.gridShowInfo[i]])
          if (!resObj.resultFlag) {
            this.alert(resObj.resultMes)
          }
        }
      }
    },
    addClicked () {
    },
    updateClicked () {},
    deleteClicked () {},
    selectClick (i) {
      console.log(i)
      this.dialogVisible = i
    },
    selDialogClicked (aObj) {
      this.dialogVisible = -1
      console.log('choose', aObj)
    },
    setDialogClose () {
      this.dialogVisible = -1
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
